<template>
	<div class="export-dialog-view" v-loading="pageLoading">
	  <div class="export-dialog">
		<div class="left-lay">
		  <div class="split-title">{{ title }}</div>
		  <div class="left-line">
			<div class="line-title">{{ $t("message.bhView.leftComponents.device") }}</div>
			<div class="line-value">{{ $store.state.btn_set_BHView2 ? $store.state.plantName : '担当課' }}</div>
		  </div>

		  <div class="left-line">
			<div class="line-title">{{ $t("message.bhView.leftComponents.object") }}</div>
			<div class="line-value">
			  {{ $store.state.macType == 1 ? $t("message.bhView.leftComponents.machine") : $t("message.bhView.leftComponents.piping") }}
			</div>
		  </div>
		  <div class="left-line">
			<div class="line-title">{{ $t("message.reportFrom.exportDialog.title_c") }}</div>
			<div class="line-value">{{ fileTypeStr }}</div>
		  </div>
		  <div class="left-draw" id="left-draw"></div>
		</div>
		<div class="tip-lay"></div>
		<div class="right-lay">
		  <div class="split-title text-right">
			<i class="el-icon-close" @click="CloseExprotDiloag"></i>
		  </div>
		  <div class="split-title">{{ $t("message.reportFrom.exportDialog.title_l") }}</div>
		  <div class="right-line">
			<div class="line-title">対象測定点：</div>
		  </div>
		  <div class="right-line unit-selection">
			<div class="line-content" style="padding-left:20px;">
			  <el-radio-group v-model="Unit">
				<el-radio :label="1" :disabled="isDisabled">「POINT」分類で、定点またはOSIにチェックがある定点</el-radio>
			  </el-radio-group>
			</div>
		  </div>
		  <div class="right-line unit-selection">
			<div class="line-content" style="padding-left:20px;">
			  <el-radio-group v-model="Unit">
				<el-radio :label="2">すべての測定点</el-radio>
			  </el-radio-group>
			</div>
		  </div>
		</div>
		<div class="FIX">
		  <getSvgView v-show="true" ref="cadViewForBH" @changeWait="changeWait" />
		</div>
		<footer class="footer-view">
		  <div class="">
			<div class="line-title" style="width: 100%">
			  {{ $t("message.reportFrom.exportDialog.tip") }}
			</div>
		  </div>
		  <div>
			<button @click="CloseExprotDiloag">Cancel</button>
			<button @click="onExportClick">OK</button>
		  </div>
		</footer>
	  </div>
	</div>
  </template>
  <script>
  import {
	GetPointClassificationInformation,
	ExRegularThicknessMeasurementRecord,

	CollectFiles,
  } from "@/api/api";
  import { getLocalStorage } from "@/utils/storage";
  import getSvgView from "./getSvg.vue";
  
  export default {
	props: ["title", "fileTypeStr", "selectMacData", "fileRadio"],
	name: "B_B_Export",
	data() {
	  return {
		Unit: 1,
		pageLoading: false,
		isDisabled: false,
		isSvgLoaded: false,
		svgSourceUrl: "",
		markupsPosList: [],
		exportCurrentIndex: 0,
		cachedReDatas: [],
		state: true
	  };
	},
	components: { getSvgView },
	methods: {
	  CloseExprotDiloag() {
		this.$emit("CloseExprotDiloag");
	  },

	  changeWait(e) {
		this.state = e;
	  },
	  wait() {
		return new Promise((resolve, reject) => {
		  if (this.state) {
			resolve();
		  } else {
			const intervalId = setInterval(() => {
			  if (this.state) {
				clearInterval(intervalId);
				resolve();
			  }
			}, 500);
		  }
		});
	  },
	  async onExportClick() {
    this.pageLoading = true;
    try {
        let MacNumb = [];
        let pdfList = [];
        let Error310 = false;
        let errorMessage310 = "";

        for (let index = 0; index < this.selectMacData.length; index++) {
            this.pageLoading = true;
            let i = this.selectMacData[index];
            MacNumb.push(i.macName);
            this.$refs.cadViewForBH.getSvgByFunFn(i.pltCode, i.macCode, 6, i.macName, {
                "DmgCode": i.macCode,
                "CorrCode": "206",
                "BlnCorrCode": `${this.formWindcraftJudgColor}`,
                SelectDate: this.operDate,
                pltCode: this.selectMacData[0].pltCode,
                "Option": "",
                "PosCode": "-1",
                "CorrJudg": "",
                "Account": "admin",
                "Type": 3
            });
            this.state = false;
            await this.wait();
            let DmgCode = parseInt(i.macCode.toString(), 10);
            let svgHtml = await this.$refs.cadViewForBH.exportSvgDataStr();
            let dataJson = {
                pltCode: i.pltCode,
                macType: i.macType,
                DmgCode,
                Unit: this.Unit,
                svgHtml
            };
            let res = await ExRegularThicknessMeasurementRecord(dataJson);
            this.pageLoading = false;

            if (res.data.code !== 0 && this.selectMacData.length === 1) {
                this.$alert(res.data.msg, '', { confirmButtonText: 'OK', type: 'warning' });
                return;
            }

            if (res.data.code === -300) {
                this.$alert(res.data.msg, '', { confirmButtonText: 'OK', type: 'warning' });
                return;
            }

            //NoData -310 err
            if (res.data.code === -310) {
                Error310 = true;
                errorMessage310 = res.data.msg;
                continue; // Continue 
            }

            if (res.data.code === 0) {
                pdfList.push(res.data.data);
            }
        }

        this.pageLoading = false;

        if (pdfList.length === 0) {
            return;
        }

        if (pdfList.length === 1) {
            this.$emit("CloseExprotDiloag");
            window.open(pdfList[0]);
        } else {
            let zipRe = await CollectFiles({ pdfList }).catch(err => {
                console.error("Error collecting files:", err);
                return { data: { code: -1 } };
            });
            if (zipRe.data.code === 0) {
                this.$emit("CloseExprotDiloag");
                window.open(zipRe.data.data);
            } else {
                this.$message({ message: zipRe.data.msg, type: 'error' });
            }
        }

        this.$emit("CloseExprotDiloag");
        this.pageLoading = false;

        //NoData -310 err
        if (Error310) {
            this.$alert(errorMessage310, '', { confirmButtonText: 'OK', type: 'warning' });
        }
    } catch (error) {
        console.error("Error in onExportClick:", error);
        this.pageLoading = false;
    }
},
	  async initFn() {
		this.pageLoading = true;
		try {
		  const res = await GetPointClassificationInformation();
		  const data = res.data.data;
		  const all = data.every(item => item.pointNo === '00');
		  if (res.data.code === 0) {
			if (all) {
					this.isDisabled = true;
					this.Unit = 2; 
				}
		  }
		} catch (error) {
		  console.error("Failed to fetch point classification information:", error);
		} finally {
		  this.pageLoading = false;
		}
	  }
	},
	created() {
	  this.initFn();
	},
	mounted() {},
	beforeDestroy() {},
	destroyed() {}
  };
  </script>
  
  <style lang="scss" scoped>
  .unit-selection {
	margin-bottom: 10px;
  }
  
  .export-dialog-view {
	position: fixed;
	width: 100%;
	height: 100%;
	left: 0;
	top: 0;
	z-index: 6;
  }
  
  .export-dialog {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 812px;
	height: 330px;
	background: #ffffff;
	box-shadow: 0px 12px 48px 16px rgba(0, 0, 0, 0.05), 0px 9px 28px 0px rgba(0, 0, 0, 0.08), 0px 6px 16px -8px rgba(0, 0, 0, 0.15);
	display: flex;
	flex-direction: row;
	padding: 0 12px;
  }
  
  .left-lay {
	position: relative;
	width: 40%;
	height: 100%;
	display: flex;
	flex-direction: column;
  
	.left-line {
	  width: 100%;
	  display: flex;
	  flex-direction: row;
	  align-items: center;
	  padding: 0px 20px;
	  padding-top: 10px;
  
	  .line-title {
		font-size: 14px;
		font-weight: 700;
		color: rgba(0, 0, 0, 0.85);
		line-height: 22px;
	  }
  
	  .line-value {
		font-size: 14px;
		font-weight: 400;
		color: #7b7b7b;
		line-height: 22px;
		margin-left: 10px;
	  }
	}
  
	.left-draw {
	  position: absolute;
	  top: 100vh;
	  width: 750px;
	  height: 611px;
	}
  }
  
  .tip-lay {
	background: red;
	width: 7px;
	border-radius: 4px;
	background: #ccc;
	margin-top: 46px;
	margin: 46px 15px 85px 15px;
  }
  
  .right-lay {
	position: relative;
	width: 60%;
	height: 100%;
	display: flex;
	flex-direction: column;
  
	.el-icon-close {
	  font-size: 16px;
	  cursor: pointer;
	  width: 46px;
	  height: 45px;
	  line-height: 45px;
	}
  
	.right-block-container {
	  width: 100%;
	  display: flex;
	  flex-direction: column;
	}
  
	.text-right {
	  padding: 0 !important;
	  text-align: right;
	}
  
	.right-line {
	  width: 100%;
	  display: flex;
	  flex-direction: row;
	  align-items: center;
	  padding: 0px 12px;
	  padding-top: 10px;
  
	  .line-title {
		min-width: 100px;
		font-size: 14px;
		font-weight: 700;
		color: rgba(0, 0, 0, 0.85);
		line-height: 22px;
		text-align: left;
		margin-right: 10px;
	  }
  
	  .line-content {
		flex-grow: 1;
		flex-shrink: 1;
		display: flex;
		flex-direction: row;
		align-items: center;
	  }
  
	  .ipt {
		width: 288px;
		height: 32px;
  
		::v-deep .el-input__inner {
		  width: 100%;
		  height: 32px;
		}
  
		::v-deep .el-input__inner:focus {
		  border: 1px solid #dcdfe6;
		}
  
		::v-deep .el-input__icon {
		  line-height: 32px;
		  color: #909399;
		}
  
		::v-deep .el-input__suffix {
		  width: 32px;
		  right: 0;
		  background: #dee0e3;
		}
	  }
  
	  .picker {
		width: 130px;
  
		::v-deep .el-input__inner {
		  width: 100%;
		}
  
		::v-deep .el-input__suffix {
		  background: transparent;
		}
	  }
  
	  span {
		padding: 0 5px;
		margin: 0 5px;
	  }
  
	  .divider {
		width: 100%;
		height: 1px;
		background-color: #f0f0f0;
	  }
	}
  
	.right-line.bottom-border {
	  padding-bottom: 10px;
	}
  
	.flex-row {
	  flex-direction: row;
	}
  
	.flex-column {
	  flex-direction: column;
	}
  }
  
  .unit-selection {
	margin: 10px 0;
  }
  
  .split-title {
	width: 100%;
	font-size: 16px;
	font-weight: 700;
	color: rgba(0, 0, 0, 0.85);
	line-height: 22px;
	padding: 12px 12px;
	border-bottom: 1px solid #f0f0f0;
  }
  
  .footer-view {
	width: calc(100% - 30px);
	box-sizing: border-box;
	position: absolute;
	z-index: 10;
	bottom: 16px;
	display: flex;
	flex-direction: row;
	align-items: center;
	justify-content: space-between;
	padding-top: 17px;
	border-top: 1px solid #f0f0f0;
	font-size: 16px;
	font-weight: 700;
  
	button {
	  width: 82px;
	  height: 32px;
	  background: #ffffff;
	  border: 1px solid #d9d9d9;
	  margin-left: 12px;
	  border-radius: 4px;
	  font-size: 14px;
	  font-weight: 500;
	}
  
	button:nth-child(2) {
	  background: #106ebe;
	  color: #fff;
	}
  }
  
  #right-CAD {
	width: 1207px;
	height: 680px;
	position: fixed;
	top: -200vh;
	left: 0;
	z-index: -999;
  }
  
  .FIX {
	width: 750px;
	height: 611px;
	position: fixed;
	top: -4000px;
	left: -500px;
  }
  </style>
  